<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>电影搜索 - 在线影院</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/style.css}">
</head>
<body>
    <div th:replace="common/header :: header"></div>

<div class="container mt-4">
    <div class="row mb-4">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <form action="/movie/search" method="get" class="row g-3">
                        <div class="col-md-3">
                            <input type="text" class="form-control" name="keyword" th:value="${keyword}" placeholder="搜索电影名称">
                        </div>
                        <div class="col-md-2">
                            <input type="text" class="form-control" name="creator" th:value="${creator}" placeholder="导演或演员">
                        </div>
                        <div class="col-md-2">
                            <select class="form-select" name="category">
                                <option value="">选择类型</option>
                                <option th:each="cat : ${categories}" th:value="${cat.id}" th:text="${cat.name}" th:selected="${cat.id == selectedCategory}"></option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <select class="form-select" name="region">
                                <option value="">选择地区</option>
                                <option th:each="reg : ${regions}" th:value="${reg.id}" th:text="${reg.name}" th:selected="${reg.id == selectedRegion}"></option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <select class="form-select" name="sort">
                                <option value="play_count" th:selected="${sort == 'play_count'}">按播放量</option>
                                <option value="score" th:selected="${sort == 'score'}">按评分</option>
                                <option value="release_date" th:selected="${sort == 'release_date'}">按上映时间</option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <button type="submit" class="btn btn-primary w-100">搜索</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <div class="list-group">
                <a th:each="movie : ${movies}" th:href="@{'/movie/detail?id=' + ${movie.id}}" class="list-group-item list-group-item-action">
                    <div class="d-flex w-100 justify-content-between align-items-center">
                        <div class="d-flex align-items-center">
                            <img th:src="${movie.coverUrl}" alt="电影封面" style="width: 100px; height: 150px; object-fit: cover;" class="me-3">
                            <div>
                                <h5 class="mb-1" th:text="${movie.name}"></h5>
                                <p class="mb-1">
                                    <span th:each="category : ${movie.categories}" class="badge bg-primary me-2" th:text="${category}"></span>
                                    <span class="badge bg-success me-2" th:text="'评分: ' + ${movie.score}"></span>
                                    <span class="text-muted" th:text="'播放: ' + ${movie.playCount}"></span>
                                </p>
                                <p class="mb-1 text-muted" th:text="${movie.description}"></p>
                            </div>
                        </div>
                    </div>
                </a>
            </div>

            <!-- 分页 -->
            <nav class="mt-4">
                <ul class="pagination justify-content-center">
                    <li class="page-item" th:classappend="${currentPage == 1 ? 'disabled' : ''}">
                        <a class="page-link" th:href="@{'/movie/search?pageNo=' + ${currentPage - 1} + '&keyword=' + ${keyword} + '&category=' + ${selectedCategory} + '&region=' + ${selectedRegion} + '&creator=' + ${creator} + '&sort=' + ${sort}}">上一页</a>
                    </li>
                    <li class="page-item" th:each="i : ${#numbers.sequence(1, pageCount)}" th:classappend="${i == currentPage ? 'active' : ''}">
                        <a class="page-link" th:href="@{'/movie/search?pageNo=' + ${i} + '&keyword=' + ${keyword} + '&category=' + ${selectedCategory} + '&region=' + ${selectedRegion} + '&creator=' + ${creator} + '&sort=' + ${sort}}" th:text="${i}"></a>
                    </li>
                    <li class="page-item" th:classappend="${currentPage == pageCount ? 'disabled' : ''}">
                        <a class="page-link" th:href="@{'/movie/search?pageNo=' + ${currentPage + 1} + '&keyword=' + ${keyword} + '&category=' + ${selectedCategory} + '&region=' + ${selectedRegion} + '&creator=' + ${creator} + '&sort=' + ${sort}}">下一页</a>
                    </li>
                </ul>
            </nav>
        </div>
    </div>
</div>

<script src="/js/bootstrap.bundle.min.js"></script>
</body>
</html>